<template>
	<view class="content">
		<view class="pageHeader">
			{{type==1?'添加地址':'编辑地址'}}
			<a class="generalBack" @click="backpage()" hover-class="none">
			 <image src="/static/b-1.png" style="width: 18upx;height: 30upx;"></image>
			 </a>
			 <text style="color: #fff;font-size: 28upx;padding:0 20upx;position: absolute;top:40upx;right: 0;" @click="save">保存</text>
		</view>
		<view class="regoodbox">
			<view style="background-color: #fff;padding:0 30upx;font-size: 28upx;">
				<view class="flex aic fillbox" >
					<text class="textleft">姓名</text>
					<input type="text" placeholder="请填写姓名" v-model="addressname" class="fillinp"/>
				</view>
				<view class="flex aic fillbox" >
					<text class="textleft">手机号</text>
					<input type="text" placeholder="请填写手机号" v-model="addressphone" class="fillinp"/>
				</view>
				<view class="flex aic fillbox"  @tap="showPicker('region')" >
					<text class="textleft">所在地区</text>
					<!-- 添加地址 -->
					<text class="fillinp" v-if="type==1">{{result.result==''?'请选择地区':result.result}}</text>
					<!-- 编辑地址 -->
					<text class="fillinp" v-if="type==2">{{result.result==''?address:result.result}}</text>
				</view>
				<view class="flex aic fillbox" >
					<text class="textleft">详细地址</text>
					<input type="text" placeholder="请填写详细地址" v-model="specificAddress" class="fillinp"/>
				</view>
			</view>
			
			<!-- 设置为默认地址 -->
			<view class="flex aic jsb" style="padding: 24upx 30upx 24upx 50upx;background-color: #fff;font-size: 26upx;color: #333;margin-top: 30upx;">
				<text class="tit">设为默认</text>
				<switch color="#EC6104" @change="switchChange" :checked="is_default==1" style="transform:scale(0.85)"/>
			</view>
			
			<!-- 三级联动 -->
			<w-picker
				mode="region"
				:value="defaultRegion"
				default-type="id"
				:hide-area="false"
				@confirm="onConfirm($event,'region')"
				@cancel="onCancel"
				ref="region" 
			></w-picker>
		
		</view>
	</view>
	</template>
	<script>
 
	import {postAjax,getAjaxx} from '../../../common/util.js'
	import wPicker from "../../../components/w-picker/w-picker.vue"
	export default {
		data() {
			return {
				userToken:'',// token
				// 传过来的地址信息
				passAddress:{},
				// 编辑还是添加 头部主题
				title:'',
				type:'',
				entertype:'',
				addressname:'',//收货人
				addressphone:'',//收货人电话
				address:'',//省市区
				specificAddress:'',//详细地址
				is_default:0,// 是否设置为默认
				//三级联动
				result:{
					result:""
				},
				defaultProps:{
					label:"name",
					value:"id"
				},
				defaultRegion:["1","37","567"]
			}
		},
		components:{
			wPicker
		},
		onLoad(options) {
			let that = this
			that.type = options.type
			that.entertype = options.entertype
			if(that.type==2){
				that.passAddress = JSON.parse(options.data)
				that.addressname = that.passAddress.name
				that.addressphone = that.passAddress.tel
				that.specificAddress = that.passAddress.address
				that.address = that.passAddress.province_name+that.passAddress.city_name+that.passAddress.county_name
				that.is_default = that.passAddress.is_default
			}
			that.userToken = uni.getStorageSync('token')
		},
		methods: {
			// 返回上一页
			backpage(){
				uni.navigateBack({
					delta:1
				})
			},
			showPicker(type){
				this.$refs[type].show();
			},
			onConfirm(res,type){
				this.result=res;
			},
			onCancel(){
				this.defaultRegion=["1","37","567"]
			},
			// 添加地址或者编辑地址
			save(){
				let that = this
				if(that.addressname==''){
					uni.showToast({
						title: '请输入收货人姓名',
						icon: 'none',
						duration: 1500
					});
					return
				}
				if(that.addressphone==''){
					uni.showToast({
						title: '请输入手机号码',
						icon: 'none',
						duration: 1500
					});
					return
				}
				
				if(that.specificAddress==''){
					uni.showToast({
						title: '请填写详细地址',
						icon: 'none',
						duration: 1500
					})
					return
				}
				let addData ={
					token:that.userToken,
					name:that.addressname,
					tel:that.addressphone,
					address:that.specificAddress,
					is_default:that.is_default,
					province:'',
					city:'',
					county:'',
				}
				if(that.type == 1){
					if(that.result.result==''){
						uni.showToast({
							title: '请选择地区',
							icon: 'none',
							duration: 1500
						});
					}
					addData.province = that.result.obj.province.id
					addData.city = that.result.obj.city.id
					addData.county = that.result.obj.area.id
				}else{
					if(that.result.result==''){
						addData.province = that.passAddress.province
						addData.city = that.passAddress.city
						addData.county = that.passAddress.county
					}else{
						addData.province = that.result.obj.province.id
						addData.city = that.result.obj.city.id
						addData.county = that.result.obj.area.id
					}
					addData.id = that.passAddress.id
				}
				postAjax('UserAddress/Save',addData,function(data){
					if(data.code==0){
						if(that.type==1){
							uni.showToast({
								title: '添加成功',
								icon: 'none',
								duration: 300
							})
						}else{
							uni.showToast({
								title: '编辑成功',
								icon: 'none',
								duration: 300
							})
						}
						uni.navigateTo({
							url:'index?entertype='+that.entertype
						})
					}else{						
						uni.showToast({
							title: data.msg,
							icon: 'none',
							duration: 300
						})					
							
					}				
				
				})
			},
			switchChange(e) {
				console.log(e.detail.value)
				if(e.detail.value){
					this.is_default =1
				}else{
					this.is_default =0
				}
			}
						
		}
	}
	
</script>

<style>
	.content{min-height: 100vh;background-color: #F9F9F9;}
	.pageHeader{width: 100%;height: 128upx;background-color: #1D84E8;line-height: 128upx;text-align: center;font-size: 36upx;color: #fff;padding-top: 40upx;}
	.generalBack{position: absolute;top:40upx;left:30upx;display: block;}
	.rebtn{display: inline-block;font-size: 30upx;border-radius: 4upx;width:120upx;height: 58upx;line-height: 58upx;}
	.rebtn::after{border: none;}
	.textleft{color: #333;width: 160upx;padding-left: 10upx;position: relative;}
	.textleft::after{content: '';width: 4upx;height: 100%;background-color: #eee;position: absolute;right: 0;top:0}
	.fillinp{padding-left: 16upx;font-size: 28upx;margin-left: 20upx;}
	.fillbox{padding:40upx 0 20upx;border-bottom: 2upx solid #eee;}
</style>
